<template>
  <div class="downLoad_com_box">
    <a href="javascript:;" class="attach_item" @click.stop="downloadFn">{{attachName}}</a>
  </div>
</template>

<script>
import {exportFunc} from '@/api/export.js'
import {mapState} from 'vuex'
/** 
* 参数说明 
* @bucketName String 存储桶名称 (ktcorete:采购-供应商...) 例：ktcorete
* @attachPath String 存储桶后面的路径 例： /upload/20210619/图片.jpeg 或 upload/20210619/图片.jpeg 或 http://119.3.226.249:19000/ktcorete/upload/20210619/图片.jpeg
* @attachName String 附件名称 例：图片.jpeg
*/
export default {
  name: 'DownloadCom',
  props: {
    bucketName: {
      type: String,
      required: true
    },
    attachPath: {
      type: String,
      required: true,
    },
    attachName: {
      type: String,
      required: true,
    },
  },
  computed: {
    ...mapState({
      headers: (state) => ({ "Blade-Auth": `bearer ${state.user.token}` }),
    })
  },
  methods: {
    downloadFn(){
      let filePath = ''
      if (this.attachPath.startsWith('http')) {
        filePath = this.attachPath.split(this.bucketName)[1]
      } else {
        filePath = this.attachPath
      }
      exportFunc('/blade-system/attach/downloadFile', this.headers, `bucket_name=${this.bucketName}&filePath=${filePath}`, this.attachName)
    }
  }
}
</script>

<style lang="scss" scoped>
.attach_item {
  color: blue;
}
.attach_item:hover {
  text-decoration: underline;
}
</style>